<template>
  <div>
    <div class="page_title">参建单位信息{{ }}</div>
    <div class="container">
      <div class="form">
        <div class="formtitle">认证基本信息{{}}</div>
        <form-create :rule="formRules" :disabled="true" v-model="formData" :option="{ submitBtn: false }" />
      </div>
      <div class="form">
        <div class="formtitle">计量器具信息{{}}</div>
        <div class="box">
          <span>计量器具总数：110 </span>
          <span>强检计量器具数：10 </span>
          <span>非强检计量器具数：100 </span>
        </div>
        <FormTable :name="table.name" :tableButton="table.button" :tableData="table.tableData" :columns="table.columns"
          :hasPagination="false" @changeTableData="changeTableData" style="margin: 0 12px;">
        </FormTable>
        <div class="para">
          监管风险等级: A
        </div>
        <div class="para">
          是否公示诚信计量自我承诺: 是
        </div>
        <div class="para">
          需改进内容: 这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容这是一条内容
        </div>
        <div class="para">
          备注: 是
        </div>
      </div>
    </div>
  </div>
</template>
<script name="list-two" setup>
import FormTable from "@/components/FormTable/index.vue";
import { queryCommit } from '@/api/rzsq';
import { onMounted } from 'vue'
import { useRoute, useRouter } from "vue-router";
import { getEnterpriseById } from '@/api/rzsq'
import { jianGuanFengXian,belongDomain } from "@/utils/enum";
let formData = ref({})
let route = useRoute()
function query() {
  let id = route.query.id
  let params = { "pageNum": 1, "pageSize": 100, "groups": [], "rules": [{ "field": "id", "data": id, "opType": "Equals" }], "orderBys": [] }
  queryCommit(params)
  getEnterpriseById({id}).then(res => {
    formData.value = res.data
  })
}
onMounted(()=>{
  query()
})
const formRules = ref([
  {
    type: "input",
    field: "enterpriseName",
    title: "单位名称",
    value: "",
  },
  {
    type: "input",
    field: "unifiedCreditCode",
    title: "统一信用代码",
    value: "",
  },
  {
    type: "input",
    field: "address",
    title: "地址",
    value: "",
  },
  {
    type: "input",
    field: "contact",
    title: "联系人",
    value: "",
  },
  {
    type: "input",
    field: "telephone",
    title: "联系电话",
    value: "",
  },
  {
    type: "select",
    field: "superviseRiskLevel",
    title: "监管风险等级",
    value: "",
    options: jianGuanFengXian
  },
  {
    type: "select",
    field: "belongDomain",
    title: "所属领域",
    value: "",
    options: belongDomain
  },
]);
const table = reactive({
  tableData: [{ id: 1 }, { id: 2 }],
  name: '器具信息列表',
  columns: [
    {
      label: "序号",
      type: "index",
      width: '70px'
    },
    {
      label: "器具名称",
      field: "name",
    },
    {
      label: "用途",
      field: "email",
    },
    {
      label: "是否强检",
      field: "email",
    },
    {
      label: "数量",
      field: "email",
    },
    {
      label: "检定日期",
      field: "email",
    },
    {
      prop: '',
      label: "检定有效期",
      field: "email",
    },
    {
      prop: '',
      label: "使用状态",
      field: "email",
    },
  ],
  totalRecordCount: 10,
  sortable: {},
});
</script>
<style lang="scss" scoped>
.container {
  background-color: white;
}

.formtitle {
  color: #4688f6;
  padding-bottom: 2px;
  padding: 12px;
  border-bottom: 2px solid #4688f6;
}

.para {
  padding: 12px;
}

.box {
  display: flex;
  justify-content: space-around;
  height: 50px;
  background-color: #4688f6;
  align-items: center;
  margin: 12px;
  color: white;
}

::v-deep .fc-form-item {
  margin-top: 12px !important;
}

::v-deep .tablecustom {
  padding: 0;
}
</style>
